{% extends 'base.html' %}

{% load signup_extras %}

{% block title %}Local issue gathering{% endblock %}

{% block extra-head %}
<link rel="stylesheet" type="text/css"  media="screen" href="{{ MEDIA_URL }}issues/issues.css" />
{% endblock %}

{% block js %}
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
 <script type="text/javascript">
    function rand(n)
    {
      return ( Math.floor ( Math.random ( ) * n + 1 ) );
    }

    rotate = rand(5)-1;
    samples = new Array();
    int_id = 0;
    samples[0] = "e.g. the bypass should be built around the town";
    samples[1] = "e.g. there should be restrictions on night flights";
    samples[2] = "e.g. graffiti along the high street should be a policing priority";
    samples[3] = "e.g. more needs to be done about broadband internet provision";
    samples[4] = "e.g. we shouldn't build on greenbelt land to the west of the city";

    function rotate_sample() {
        sample = samples[rotate];
        $('#id_question').val(sample);
        rotate = (rotate+1)%5;
    }

    $(document).ready(function () {        
        rotate_sample();

        int_id = setInterval("rotate_sample();", 4000);

        $("#id_save").attr("disabled","disabled");
        
        
	    $('#id_question').click(function() {
            $('#id_question').removeClass("sample").addClass("issue");
            clearInterval(int_id);

            if($('#id_question').val() == sample)
            {
                $('#id_question').val("")
            }

            $('#id_save').removeAttr('disabled');
            $('#id_guide').hide();
	    });

        $('#id_question').focus($('#id_question').click);
        //$('#id_question').focus();
    });

 </script>
{% endblock %}

{% block content %}
<div class="span-8 last task">
{% if submitted %}
 <div style="padding:0.5em;border:1px solid #EEE;margin-top:1em;margin-bottom:1em;">
    <h3 style="margin-top:0">Thank you for adding an issue!</h3>
    Please carry on adding more issues for as long as you have the energy or <a href='{% url constituency slug=constituency.slug %}'>go back</a>.<br/>Also, why not share what you've done?

    <a href="http://twitter.com/home?status=I've%20just%20posted%20a%20local%20policy%20idea%20for%20{{ constituency.name|urlencode }}%20on%20@democlub%20{{constituency.get_absolute_url|shorten}}%20%23ge2010" target="_blank">Share on Twitter</a> or using <script type="text/javascript" src="http://w.sharethis.com/button/sharethis.js#publisher=b709ae1d-96fa-4a11-b622-2e53080cec42&amp;type=website&amp;style=rotate;"></script>
 </div>
{% else %}
 <h3>
  Describe local issues
 </h3>
{% endif %}

{% if form %}
    <form action="" method="post" id="add_issue">
         <div class="fieldWrapper">
            {{ form.constituency.errors }}
            {{ form.question.errors }}
            <label for="id_question">
                Some voters in {{ constituency.name }} think that...
            </label>
            <input id="id_question" name="question" maxlength="200" type="text" class="sample">
        </div>
        <div class="fieldWrapper">
            {{ form.reference_url.errors }}
            <label for="id_reference_url">
                If possible, please provide a link that shows that this is a real local issue
            </label>
            {{ form.reference_url }}
            <p class="helptext">
                e.g. http://www.cares.ukhome.net/
            </p>
        </div>
        <input type="submit" value="Save" id="id_save" /> <span class="quiet" id="id_guide">(enter an idea first)</span>
    </form>
{% endif %}
 <p></p>
</div>

<hr/>

<div class="span-4">
    <p class="helptext">
        Write a <strong>statement not a question</strong>. It's best if it's an <strong>idea</strong> of what <strong>should</strong> or <strong>needs</strong> to be done.
        Keep it <strong>genuinely local</strong> to {{ constituency.name }} constituency.  Soon, we'll use these ideas to produce questions we can ask your local candidates.
    <!--    Make sure <strong>some candidates will agree, some disagree</strong> with the statement.  -->
    </p>

    <p>If you're stuck for ideas, why not check out some of these resources?</p>
    <ul>
        <li><a href='{{ constituency.wikipedia_url }}' target="_blank">Your constituency on wikipedia</a></li>
        <li><a href='http://democracyclub.activeboard.com/index.spark?aBID=134686&p=3&topicID=33537484' target="_blank">Read more about the task, including video</a></li>
        <li><a href='http://www.google.com/search?q={{ constituency.name }}%20issues%20UK' target="_blank">Google for local issues</a></li>
        <li><a href='http://openlylocal.com/hyperlocal_sites?location={{ constituency.name }},%20UK&commit=Search' target="_blank">Local blogs near {{ constituency.name }}</a></li>
    </ul>
</div>

<div class="span-4 last">
<h3>Existing issues in {{ constituency.name }}</h3>
{% include "issues/issue_list.html" %}
</div>

{% endblock %}
